<template>


<div id="mine">
  <van-nav-bar
  title="我的"


  class="header"

  right-text="退出"
  @click-right="exit()"
/>


<div class="headers">
<div class="image_head_box">

<img :src=member.icon alt="头像" srcset="" class="head_img">
</div>

<div class="user_name">
{{member.nickname}}
</div>
</div>
<!-- // 顶部头像区域 -->


<div class="mine_body">
  <router-link to="/vipinfo">
  <van-cell title="基本信息" icon="contact" is-link />
  </router-link>
  <van-cell title="我的发布" icon="records" is-link to="publish" />
<van-cell   icon="pending-evaluate
" is-link to="message">
  <template slot="title">

    <span class="custom-text">未读消息</span>

    <van-tag type="danger">{{count}}</van-tag>
  </template>
</van-cell>



</div>
<!-- // cell 列表 -->

 <app-footer></app-footer>
</div>

</template>


<script>
import AppFooter from '@/pages/Commons/Footer.vue'
import axios from 'axios'
export default{
  components:
  {
    AppFooter
  },
  data(){
    return{
member:"",
count:''
    }
  },
  methods:{

exit(){

  localStorage.removeItem('token');
  this.$router.push({path: '/login'});

}
  },
  mounted() {

    var userid=localStorage.getItem('userid');
    var token=localStorage.getItem('token');

  console.log(userid)
  console.log(token)

 axios.get('/api/user/info',{
  headers: {
            'Authorization': 'Bearer ' + token
        },
        params: {
          id: userid,
        }
      })
      .then((response) => {
        console.log(response.data);//请求的返回体
        this.member=response.data.data;



      })
      .catch((error) => {
        console.log(error);//异常
      });//获取用户信息


axios.get('/api/message/quantity',{
  headers: {
            'Authorization': 'Bearer ' + token
        },

      })
      .then((response) => {
        console.log(response.data);//请求的返回体
        this.count =response.data

      })
      .catch((error) => {
        console.log(error);//异常
      });//获取未读消息


},
}

</script>



<style lang="stylus" scoped>


.headers{
  width: 100%;height: 12rem;background:#259E7B;position: relative
}
.header{
    background: #259e7b;
    color: white
}
.van-icon-arrow::before,.van-nav-bar__text{color: white}
.head_img{width: 7rem;height: 7rem;
position:absolute;
	top:-2rem;
	bottom:0;
	left:0;
	right:0;
	margin:auto;
  border-radius :50%
}
.user_name {
width: 100%;height: 2rem;
position:absolute;
	top:7rem;
	bottom:0;
	left:0;
	right:0;
	margin:auto;

  text-align: center;
  font-size: 1.2rem;
color: aliceblue
}
</style>
